<template>
    <view class="content">
        <uv-cell-group>
            <uv-cell :label="'约驾时长：'+list.durationHours+'小时'+' ， 是否有车：'+(list.ownCarFlag==1?'有':'无')"
                v-for="list in lists">
                <template v-slot:title class="fs-28">
                    <view>姓名：{{list.stuName}}</view>
                    <view @click="callPhone(list.stuPhoneNum)">联系电话：{{list.stuPhoneNum}}</view>
                    <view>接送地址：{{list.address}}</view>
                    <view>接送时间：{{list.transferTime}}</view>
                </template>
                <template v-slot:value>
                    <uv-button type="primary" v-if="list.orderStatus==2">尾款待支付</uv-button>
                    <uv-button type="primary" v-if="list.orderStatus==3">尾款已支付</uv-button>
                </template>
            </uv-cell>
        </uv-cell-group>
        <uv-load-more @loadmore="loadMore" :status="status"></uv-load-more>
    </view>
</template>

<script setup lang="ts">
    import { getOrderList, receiveOrder, getCoachOrderList } from "@/src/api/index.ts"
    import { onMounted, ref } from 'vue';
    import { onPullDownRefresh } from "@dcloudio/uni-app";
    const lists = ref([]);
    const status = ref('loadmore');
    //页码
    const pageSize = ref(10);
    //刷新
    onPullDownRefresh(() => {
        pageSize.value = 10;
        getPage();
        uni.stopPullDownRefresh();

    })
    onMounted(() => {
        //{orderStatus:}
        getPage();

    })
    const callPhone=(phone)=>{
        uni.makePhoneCall({
            phoneNumber:phone
        })
    }
    const getPage = () => {
        getCoachOrderList({ pageNo: 1, pageSize: pageSize.value }).then(res => {
            lists.value = res.result.records;
            //判断分页是否结束
            if (pageSize.value >= res.result.total) {
                status.value = 'nomore'
            }
        })
    }
    //分页查询
    const loadMore = () => {
        pageSize.value += 10;
        // status.value = 'loading '
        getPage();
        console.log('2323')
    }
    const receiving = (id) => {
        receiveOrder({ id: id }).then(res => {
            if (res.success) {
                uni.showToast({
                    icon: "none",
                    title: "接单成功"
                })
            }
        })
    }
</script>

<style>

</style>